<template>
  <div class="request-container">
    <div class="control-group" style="width: 500px;">
      <a-button  v-for="item in demoList"  size="small" @click="butDemo(item)">{{ item.name }}</a-button>
    </div>
    <div class="control-group" style="width: 500px;">
      <a-button  v-for="item in demoList2"  size="small" @click="butDemo(item)">{{ item.name }}</a-button>
    </div>
    <div class="control-group" style="width: 500px;">
      <a-button  v-for="item in demoList3"  size="small" @click="butDemo(item)">{{ item.name }}</a-button>
    </div>
    <div class="control-group">
      请求服务器：
      <input
          v-model="requestConfig.server"
          placeholder="输入请求URL"
          class="url-input"
      >
    </div>
    <div class="control-group">
      <select v-model="requestConfig.method" class="method-select">
        <option value="GET">GET</option>
        <option value="POST">POST</option>
        <option value="DELETE">DELETE</option>
      </select>
      <input
          v-model="requestConfig.url"
          placeholder="输入请求URL"
          class="url-input"
      >
      <button @click="sendRequest" class="send-btn">发送请求</button>
    </div>

    <div class="json-editor">
      <label>请求数据（JSON）：</label>
      <textarea
          v-model="requestConfig.body"
          placeholder='{"key":"value"}'
          :disabled="requestConfig.method === 'GET'"
      ></textarea>
    </div>

    <div class="response-area">
      <h3>响应结果：</h3>
      <pre>{{ responseData }}</pre>
    </div>
  </div>
</template>

<script setup>
import { reactive, ref } from 'vue'
import { PostJsonWithTLCP, GetWithTLCP } from '../../../wailsjs/go/main/App'

// 响应式请求配置
const requestConfig = reactive({
  server: 'https://10.0.241.22:10443/',
  method: 'POST',
  url: '',
  body: ''
})
const responseData = ref(null)

const demoList = ref([
  {
    method: "GET",
    url: "v1/api/vkf/searchDevice?deviceId=31011700001320000011",
    name: "查询设备"
  },
  {
    method: "POST",
    url: "v1/api/vkf/multiPacketGenerateSignalCheckData",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"messageBody\": \"TUVTU0FHRTxzaXA6MzEwMTE3MDAwMDEzMjAwMDAxMTJAMTAuMTAuMTEuMjAxOjUwNjA+O3RhZz02OTUzMjcyNTU8c2lwOjMxMDExNzAwMDAyMDkwMDAwMDAxQDEwLjEwLjEyLjE2Mjo1MDYwPjt0YWc9ZTMzNTg2NGM5Y2I0OTg1NTI5MmVlNWE2MGE1YWI3NWMuZDcwMGQxZTQyMDcxNDczMTYwMjAyMy0wNC0xM1QwOTo1MDoxNS42ODc=\",\n" +
        "    \"signalData\": \"TUVTU0FHRTxzaXA6MzEwMTE3MDAwMDEzMjAwMDAxMTJAMTAuMTAuMTEuMjAxOjUwNjA+O3RhZz02OTUzMjcyNTU8c2lwOjMxMDExNzAwMDAyMDkwMDAwMDAxQDEwLjEwLjEyLjE2Mjo1MDYwPjt0YWc9ZTMzNTg2NGM5Y2I0OTg1NTI5MmVlNWE2MGE1YWI3NWMuZDcwMGQxZTQyMDcxNDczMTYwMjAyMy0wNC0xM1QwOTo1MDoxNS42ODc=\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\"\n" +
        "}",
    name: "信令数据签名"
  },
  {
    method: "POST",
    url: "v1/api/vkf/multiPacketVerifySignalCheckData",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"messageBody\": \"TUVTU0FHRTxzaXA6MzEwMTE3MDAwMDEzMjAwMDAxMTJAMTAuMTAuMTEuMjAxOjUwNjA+O3RhZz02OTUzMjcyNTU8c2lwOjMxMDExNzAwMDAyMDkwMDAwMDAxQDEwLjEwLjEyLjE2Mjo1MDYwPjt0YWc9ZTMzNTg2NGM5Y2I0OTg1NTI5MmVlNWE2MGE1YWI3NWMuZDcwMGQxZTQyMDcxNDczMTYwMjAyMy0wNC0xM1QwOTo1MDoxNS42ODc=\",\n" +
        "    \"checkData\": \"HUoB76y5IODA1YyN1fj0Udtfl49b76Bcu6xmiVmTTs8=\",\n" +
        "    \"signalData\": \"TUVTU0FHRTxzaXA6MzEwMTE3MDAwMDEzMjAwMDAxMTJAMTAuMTAuMTEuMjAxOjUwNjA+O3RhZz02OTUzMjcyNTU8c2lwOjMxMDExNzAwMDAyMDkwMDAwMDAxQDEwLjEwLjEyLjE2Mjo1MDYwPjt0YWc9ZTMzNTg2NGM5Y2I0OTg1NTI5MmVlNWE2MGE1YWI3NWMuZDcwMGQxZTQyMDcxNDczMTYwMjAyMy0wNC0xM1QwOTo1MDoxNS42ODc=\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\"\n" +
        "}",
    name: "信令数据验签"
  },
  {
    method: "POST",
    url: "v1/api/vkf/generateVEMK",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"algorithmVemk\": \"1025\",\n" +
        "    \"securityLevel\": \"3\",\n" +
        "    \"timer\": \"2025-05-08 12:25:20\"\n" +
        "}",
    name: "设备注册"
  },
  {
    method: "DELETE",
    url: "v1/api/vkf/deleteVEMK",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"timer\": \"2025-05-08 11:11:37\"\n" +
        "}",
    name: "设备注销"
  },
  {
    method: "POST",
    url: "v1/api/vkf/generateIpcVKEK",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"registerTime\": \"2025-05-08 12:25:20\",\n" +
        "    \"pucPubKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"algorithmVkek\": \"1025\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\"\n" +
        "}",
    name: "通用设备签到"
  },
  {
    method: "POST",
    url: "v1/api/vkf/exportVKEKDates",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"pucPubKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"startDate\": \"2025-05-08T14:04:35\",\n" +
        "    \"endDate\": \"2025-05-08T14:04:36\"\n" +
        "}",
    name: "根据时间导出VKEK"
  },
])

const demoList2 = ref([

  {
    method: "POST",
    url: "v1/api/vkf/exportVKEKVersion",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"pucPubKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"algorithmVkek\": \"1025\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\"\n" +
        "}",
    name: "根据VKEK版本号查询"
  },
  {
    method: "POST",
    url: "v1/api/vkf/encodeVideo",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\",\n" +
        "    \"cipherVek\": \"qwertyuiopasdfghqqqwei\",\n" +
        "    \"algorithmVek\": 7,\n" +
        "    \"plainData\": \"TUVTU0FHRTxzaXA6MzEwMTE3MDAwMDEzMjAwMDAxMTJAMTAuMTAuMTEuMjAxOjUwNjA+O3RhZz02OTUzMjcyNTU8c2lwOjMxMDExNzAwMDAyMDkwMDAwMDAxQDEwLjEwLjEyLjE2Mjo1MDYwPjt0YWc9ZTMzNTg2NGM5Y2I0OTg1NTI5MmVlNWE2MGE1YWI3NWMuZDcwMGQxZTQyMDcxNDczMTYwMjAyMy0wNC0xM1QwOTo1MDoxNS42ODc=\"\n" +
        "}",
    name: "视频数据加密"
  },
  {
    method: "POST",
    url: "v1/api/vkf/decryptVideo",
    body: "{\n" +
        "    \"deviceId\": \"31011700001320000011\",\n" +
        "    \"vkekVersion\": \"2025-05-08T12:25:20\",\n" +
        "    \"cipherVek\": \"qwertyuiopasdfghqqqwei\",\n" +
        "    \"algorithmVek\": 7,\n" +
        "    \"cipherData\": \"ca5G62uLgrT9x56XlaHHzMOSezSpNrAndbHnxnA+Fucyzns1zyO9nEIesIryN/2lQY0rH4PAx9KpURHw6s7UWrwRcfXXgAqJNdjywD+AqQg22xyM3VmlrmZelBu3P6DGcyOkYIlaqI1Osp9upZECQOZ41Xa9AJ8UQbLZ0wDGre3Uoh6KUQ4uYvpX8tRQbweZVpc80JZcF5p76JOz5Ou4Br3+2xmjqZnobswhFI70PDNLycvOr5fRl8uqEhTgG+K7\"\n" +
        "}",
    name: "视频数据解密"
  },
  {
    method: "POST",
    url: "v1/api/vkf/multiPacketGenerateSignalCheckData",
    body: "{\n" +
        "    \"signalData\": \"TUVTU0FHRTxzaXA6NDEwMTAwMDAwMDEzMjAwMDAyMDlANDEwMTAwMDAwMD47dGFnPTg1NzQzMTY5OTxzaXA6NDEwMTAwMDAwMDIwMDAwMDAwNDJANDEwMTAwMDAwMD42NjQzMjkzNjcyMDI0LTA0LTAzVDE2OjEzOjA3\",\n" +
        "    \"messageBody\": \"PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iR0IyMzEyIj8+CjxOb3RpZnk+CjxDbWRUeXBlPktlZXBhbGl2ZTwvQ21kVHlwZT4KPFNOPjk5Mjc3PC9TTj4KPERldmljZUlEPjQxMDEwMDAwMDAxMzIwMDAwMjA5PC9EZXZpY2VJRD4KPFN0YXR1cz5PSzwvU3RhdHVzPgo8SW5mbz4KPC9JbmZvPgo8L05vdGlmeT4K\",\n" +
        "    \"deviceId\": \"31011700001320000011\"\n" +
        "}",
    name: "生成信令校验数据(大报文) "
  },
  {
    method: "POST",
    url: "v1/api/vkf/multiPacketVerifySignalCheckData",
    body: "{\n" +
        "    \"checkData\": \"ZSMrto3g/trofGdcsy8EPbukZ7TDwGSONvn6VcSvMzY=\",\n" +
        "    \"signalData\": \"TUVTU0FHRTxzaXA6NDEwMTAwMDAwMDEzMjAwMDAyMDlANDEwMTAwMDAwMD47dGFnPTg1NzQzMTY5OTxzaXA6NDEwMTAwMDAwMDIwMDAwMDAwNDJANDEwMTAwMDAwMD42NjQzMjkzNjcyMDI0LTA0LTAzVDE2OjEzOjA3\",\n" +
        "    \"messageBody\": \"PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iR0IyMzEyIj8+CjxOb3RpZnk+CjxDbWRUeXBlPktlZXBhbGl2ZTwvQ21kVHlwZT4KPFNOPjk5Mjc3PC9TTj4KPERldmljZUlEPjQxMDEwMDAwMDAxMzIwMDAwMjA5PC9EZXZpY2VJRD4KPFN0YXR1cz5PSzwvU3RhdHVzPgo8SW5mbz4KPC9JbmZvPgo8L05vdGlmeT4K\",\n" +
        "    \"deviceId\": \"31011700001320000011\"\n" +
        "}",
    name: "校验信令校验数据（大报文）"
  },
])

const demoList3 = ref([

  {
    method: "POST",
    url: "kms/get/vkek",
    body: "{\n" +
        "    \"gbCode\": \"76\",\n" +
        "    \"devCode\": \"31011700001320000011\",\n" +
        "    \"keyVersion\": \"2025-05-08T12:25:50\",\n" +
        "     \"publicKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"gwPublicKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\"\n" +
        "}",
    name: "附件6查询vkek"
  },
  {
    method: "POST",
    url: "kms/get/time/frame/vkek",
    body: "{\n" +
        "    \"gbCode\": \"31011700002090241022\",\n" +
        "    \"devCode\": \"31011700001320000011\",\n" +
        "    \"userCode\": \"31011700001320000011\",\n" +
        "    \"publicKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"gwPublicKey\": \"MFkwEwYHKoZIzj0CAQYIKoEcz1UBgi0DQgAE7W67odj+X7dMYBcxHqbKk1JzY3w2tv7zrzMmz5egxFCJzSJRuv8hp2qRSlTP88ioNL7Q5GwiU2YdyreYU0FHYg==\",\n" +
        "    \"startTime\": \"2025-05-08T14:04:35\",\n" +
        "    \"endTime\": \"2025-05-08T14:04:36\",\n" +
        "    \"pageIndex\": 1\n" +
        "}",
    name: "附件6按时间查询vkek"
  },
])

const butDemo = (demo) => {
  requestConfig.method = demo.method
  requestConfig.url = demo.url
  requestConfig.body = demo.body
}

// 发送请求逻辑
const sendRequest = async () => {
  responseData.value = ""
  try {
    // 参数验证
    if (!requestConfig.url) {
      alert('请输入请求URL')
      return
    }

    // 调用Go后端方法[12](@ref)
    if (requestConfig.method === 'POST' || requestConfig.method === 'DELETE') {
      const result = await PostJsonWithTLCP(requestConfig.server + requestConfig.url, requestConfig.body, requestConfig.method)
      responseData.value = JSON.stringify(result, null, 2)

    } else {
      const result = await GetWithTLCP(requestConfig.server + requestConfig.url)
      responseData.value = JSON.stringify(result, null, 2)
    }


  } catch (error) {
    responseData.value = `请求错误：${error.message}`
  }
}
</script>

<style scoped>
.request-container {
  padding: 20px;
  max-width: 800px;
}
.control-group {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}
.method-select {
  width: 100px;
}
.url-input {
  flex: 1;
}
.send-btn {
  background: #3498db;
  color: white;
  border: none;
  padding: 0 20px;
}
.json-editor textarea {
  width: 100%;
  height: 150px;
  margin-top: 10px;
}
.response-area pre {
  background: #f5f5f5;
  padding: 15px;
  border-radius: 4px;
}
</style>